<!-- 右下角工具栏 -->
<template>
    <div >
		<div class="content">
			<div 
			class="list" 
			v-for="(item,index) in tablist" 
			:key="index"
			@click="ontab(index)"
			:id="tabindex==index?'active':''"
			><a-icon :type="item.icon" :id="tabindex==index?'active':''"/>{{item.name}}</div>
		</div>
		<!-- <el-dialog
		  title=""
		  :visible.sync="dialogexamine"
		  width="450px"
		  :show-close="false">
			<div class="pop-content"> 
				
			</div>
		</el-dialog> -->
    </div>
</template>

<script>
  export default {
    name: "toolbar",
    data(){
      return{
			dialogexamine: false,
			tabindex:-1,
			tablist:[
				{name:'点',icon:'compass'},
				{name:'线',icon:'api'},
				{name:'区域',icon:'code'},
				{name:'设置',icon:'setting'}
			]
      }
    },
    methods:{
		ontab(index){
			this.tabindex = index
			if(index==3){
				this.$emit('set')
			}
			
		}
    },
    mounted() {
		
    },
    destroyed() {
		
    }
  }
</script>

<style scoped lang="less">
	.content{
		width: 85px;
		.list{
			width: 100%;
			font-size: 17px;
			line-height: 17px;
			margin-bottom: 18px;
			font-size: 14px;
			cursor: pointer;
			color: #fff;
			i{
				color: #fff;
				margin-right: 9px;
			}
		}
	}
	#active{
		color: #98f8ff;
	}
	// .pop-content{
	// 	width: 100%;
	// 	height: 480px;
	// 	background-color: pink;
	// 	z-index: 999;
	// }
</style>